var oDiv = $("#u35");
var oUl = $("#ul1");
oDiv.click(function () {
  oUl.slideToggle();
});
$(".div2").click(function () {
  $(".ul2").slideToggle();
});
$(".div3").click(function () {
  $(".ul3").slideToggle();
});
$(".div4").click(function () {
  $(".ul4").slideToggle();
});
$(".div5").click(function () {
  $(".ul5").slideToggle();
});
$(".div6").click(function () {
  $(".ul6").slideToggle();
});

//数据
var data = [
  {
    id: 1,
    optionBox: '<input type="checkbox" class="inputBtn2">',
    levelName: "不良后果事件",
    LevelContent: "客观环境或条件可能引发错误（错误隐患）",
    pinyinCode: "-",
    fiveCode: "-",
    remark: "-",
  },
  {
    id: 2,
    optionBox: '<input type="checkbox"class="inputBtn2">',
    levelName: "A级",
    LevelContent: "发生错误但未发给患者，或已发给患者但患者未使用",
    pinyinCode: "-",
    fiveCode: "-",
    remark: "-",
  },
  {
    id: 3,
    optionBox: '<input type="checkbox" class="inputBtn2">',
    levelName: "B级",
    LevelContent:
      "患者已使用，需要监测错误对患者造成的后果，并根据后果判断是否需要采取措施预防和减少伤害）",
    pinyinCode: "-",
    fiveCode: "-",
    remark: "-",
  },
  {
    id: 4,
    optionBox: '<input type="checkbox"class="inputBtn2">',
    levelName: "C级",
    LevelContent:
      "错误导致患者生命垂危，需采取维持生命的措施（如心肺复苏、除颤、插管等）",
    pinyinCode: "-",
    fiveCode: "-",
    remark: "-",
  },
  {
    id: 5,
    optionBox: '<input type="checkbox"class="inputBtn2">',
    levelName: "D级",
    LevelContent: "客观环境或条件可能引发错误（错误隐患））",
    pinyinCode: "-",
    fiveCode: "-",
    remark: "-",
  },
  {
    id: 6,
    optionBox: '<input type="checkbox"class="inputBtn2">',
    levelName: "F级",
    LevelContent: "客观环境或条件可能引发错误（错误隐患）",
    pinyinCode: "-",
    fiveCode: "-",
    remark: "-",
  },
  {
    id: 7,
    optionBox: '<input type="checkbox" class="inputBtn2">',
    levelName: "A级",
    LevelContent: "客观环境或条件可能引发错误（错误隐患）",
    pinyinCode: "-",
    fiveCode: "-",
    remark: "-",
  },
  {
    id: 8,
    optionBox: '<input type="checkbox"class="inputBtn2">',
    levelName: "A级",
    LevelContent: "客观环境或条件可能引发错误（错误隐患）",
    pinyinCode: "-",
    fiveCode: "-",
    remark: "-",
  },
  {
    id: 9,
    optionBox: '<input type="checkbox"class="inputBtn2">',
    levelName: "A级",
    LevelContent: "客观环境或条件可能引发错误（错误隐患）",
    pinyinCode: "-",
    fiveCode: "-",
    remark: "-",
  },
  {
    id: 10,
    optionBox: '<input type="checkbox"class="inputBtn2">',
    levelName: "A级",
    LevelContent: "客观环境或条件可能引发错误（错误隐患）",
    pinyinCode: "-",
    fiveCode: "-",
    remark: "-",
  },
  {
    id: 11,
    optionBox: '<input type="checkbox"class="inputBtn2">',
    levelName: "A级",
    LevelContent: "客观环境或条件可能引发错误（错误隐患）",
    pinyinCode: "-",
    fiveCode: "-",
    remark: "-",
  },
  {
    id: 12,
    optionBox: '<input type="checkbox" class="inputBtn2">',
    levelName: "B级",
    LevelContent: "客观环境或条件可能引发错误（错误隐患）",
    pinyinCode: "-",
    fiveCode: "-",
    remark: "-",
  },
  {
    id: 13,
    optionBox: '<input type="checkbox" class="inputBtn2">',
    levelName: "A级",
    LevelContent: "客观环境或条件可能引发错误（错误隐患）",
    pinyinCode: "-",
    fiveCode: "-",
    remark: "-",
  },
  {
    id: 14,
    optionBox: '<input type="checkbox" class="inputBtn2">',
    levelName: "A级",
    LevelContent: "客观环境或条件可能引发错误（错误隐患）",
    pinyinCode: "-",
    fiveCode: "-",
    remark: "-",
  },
];

var page = 1;

var count = 5;
//导航点击按钮
var oLi=document.querySelectorAll('.liBtn li');
// var oDiv=document.querySelectorAll('.cont')
console.log(oLi)

var oTbody = document.querySelector("tbody");
//获取分页
var oPagination = document.querySelector(".pagination");

//获取分页左右按钮
var oLeft = document.querySelector(".left");
var oRight = document.querySelector(".right");

var oInput = document.querySelector(".inputBtn");

var oInquire = document.querySelector(".inquire");
var aInquire = document.querySelectorAll(".inquireInput");
var oClear = document.querySelector(".clearBtn");
//添加
var oSubmit = document.querySelector(".submitBtn");
//重置
var oReset = document.querySelector(".resetBtn");
//修改
var oReviseBtn = document.querySelector(".reviseBtn");
var oSubmitEditBtn = document.querySelector(".submitEditBtn");

//获取添加框
 var addLevel = document.querySelector(".addLevel");
  var addId = document.querySelector(".addId")
  var addName = document.querySelector(".addName");
  var addDescription = document.querySelector(".addDescription");
  var addPhonetic = document.querySelector(".addPhonetic");
  var addWuBi = document.querySelector(".addWuBi");
//删除
var oDel = document.querySelector(".del");

for(var i=0;i<oLi.length;i++){
  (function(index){
    oLi[i].onclick=function(){
      for(var j=0;j<oLi.length;j++){
           oLi[j].className='';

      }
      this.className='active'
    }
  })(i)
   
}

//渲染数据
function render() {
  var str = aInquire[0].value;
  var str1 = aInquire[1].value;
  var str2 = aInquire[2].value;

  var inquireData = [];
  var data1 = [];
  var data2 = [];

  if (str.trim() == "") {
    data1 = data;
  } else {
    data1 = data.filter(function (v) {
      if (v.levelName.includes(str)) {
        return v;
      }
    });
  }
  if (str1.trim() == "") {
    data2 = data1;
  } else {
    data2 = data1.filter(function (v) {
      if (v.LevelContent.includes(str1)) {
        return v;
      }
    });
  }

  if (str2.trim() == "") {
    inquireData = data2;
  } else {
    inquireData = data2.filter(function (v) {
      if (v.pinyinCode.includes(str2)) {
        return v;
      }
    });
  }
  oTbody.innerHTML = "";

  var renderArr = inquireData.slice((page - 1) * count, count * page);

  // console.log(renderArr)
  for (var i = 0; i < renderArr.length; i++) {
    var oTr = document.createElement("tr");

    oTr.innerHTML = `<tr>
        <td>${renderArr[i].optionBox}</td>
        <td>${renderArr[i].levelName}</td>
        <td>${renderArr[i].LevelContent}</td>
        <td>${renderArr[i].pinyinCode}</td>
        <td>${renderArr[i].fiveCode}</td>
        <td>${renderArr[i].remark}</td>
     </tr>`;
    oTbody.appendChild(oTr);
  }
  //页码渲染
  var oPageBtn = document.querySelectorAll(".pageBtn");
  for (var i = 0; i < oPageBtn.length; i++) {
    oPagination.removeChild(oPageBtn[i].parentNode);
  }
  for (var i = 1; i <= Math.ceil(inquireData.length / count); i++) {
    var oLi = document.createElement("li");

    oLi.innerHTML = `<a class="pageBtn" href="#">${i}</a>`;
    if (i == page) {
      oLi.classList.add("active");
    }
    oPagination.insertBefore(oLi, oPagination.lastElementChild);
  }


  //全选
var n=0;
var aInput = oTbody.querySelectorAll(".inputBtn2");
oInput.addEventListener("click", inputFn2);
function inputFn2() {
  if (oInput.checked == true) {
    for (var i = 0; i < aInput.length; i++) {
      aInput[i].checked = true;
      n=aInput.length;
    }
  } else {
    for (var i = 0; i < aInput.length; i++) {
      aInput[i].checked = false;
      n=0;
    }
  }
}
for(var i = 0; i < aInput.length; i++){
  aInput[i].onclick=function(){
    if(this.checked==true){
          n++;
    }else{
      n--;
    }
    console.log(n)
    if(n==aInput.length){
      console.log(aInput.length)
      oInput.checked=true
    
    }else{
      oInput.checked=false

    }
  }
}
}
render();

//渲染页码
oPagination.addEventListener("click", changeFn);
function changeFn() {
  if (event.target.className == "pageBtn") {
    page = event.target.innerText;
    
    render();
  }
}
//页面左右
oLeft.addEventListener("click", leftBtn);
oRight.addEventListener("click", rightBtn);
function leftBtn() {
  if (page > 1) {
    page--;
    render();
  }
}
function rightBtn() {
  if (page < Math.ceil(data.length / count)) {
    page++;
    render();
  }
}



//搜索功能
oInquire.addEventListener("click", inquireFn);
function inquireFn() {
  page = 1;
  render();
}
//清除
oClear.addEventListener("click", clearBtn);
function clearBtn() {
  for (var i = 0; i < aInquire.length; i++) {
    aInquire[i].value = "";
  }
  render();
}
//验证表单
//  var rule={
//     idName:{
//       res:/^ [A-Z][0-9]{5}&/,
//       err:
//     },
//     levelName:{
//       res:/^[A-Z][\u4e00-\u9fa5]&/
//     }
//   }
//   addId.addEventListener('blur',idFn)
//   function idFn(){

//   }


//添加
oSubmit.addEventListener("click", submitFn);
function submitFn() {
  // var addLevel = document.querySelector(".addLevel");
  // var addId = document.querySelector(".addId")
  // var addName = document.querySelector(".addName");
  // var addDescription = document.querySelector(".addDescription");
  // var addPhonetic = document.querySelector(".addPhonetic");
  // var addWuBi = document.querySelector(".addWuBi");
  // console.log(addId)

  var str1= addLevel.value;
  var str2=addId.value;
  var str3=addName.value;
  var str4=addDescription.value
  var str5=addPhonetic.value;
  var str6=addWuBi.value

    if(str2.trim()==''){
       alert('请在输入框内输入内容')
    }else if(str3.trim()==''){
       alert('请在输入框内输入内容')
    }else if(str4.trim()==''){
      alert('请在输入框内输入内容')
    }else if(str5.trim()==''){
      alert('请在输入框内输入内容')
    }else if(str6.trim()==''){
      alert('请在输入框内输入内容')
    }else{
      console.log(addName)
      console.log(addDescription)
      console.log(addPhonetic)
    data.unshift({
      optionBox: '<input type="checkbox" class="inputBtn2">',
      levelName: str3,
      LevelContent: str4,
      pinyinCode: str5,
      fiveCode: str6,
      remark: "-",
    });
    render();
    $("#addModal").modal("hide");
    addLevel.value='--请选择--'
    addId.value=''
    addName.value=''
    addDescription.value=''
    addPhonetic.value=''
    addWuBi.value=''
    }
}
  

//重置
oReset.addEventListener("click", resetFn);
function resetFn() {
  var addLevel = (document.querySelector(".addLevel").value = "--请选择--");
  var addId = (document.querySelector(".addId").value = "");
  var addName = (document.querySelector(".addName").value = "");
  var addDescription = (document.querySelector(".addDescription").value = "");
  var addPhonetic = (document.querySelector(".addPhonetic").value = "");
  var addWuBi = (document.querySelector(".addWuBi").value = "");

}
//删除功能
oTbody.addEventListener("click", inputFn);
function inputFn() {
  if (event.target.className.includes("inputBtn2")) {
    var id = event.target.parentNode.nextElementSibling.innerText;
  }
  oDel.addEventListener("click", delFn);
  function delFn() {
    for (var i = 0; i < data.length; i++) {
      if (data[i].levelName == id) {
        console.log(data[i].levelName, id);
        data.splice(i, 1);

        $("#delModal").modal("hide");
        oInput.checked = false;
      }
    }
    render();
  }
 
}

//修改
//选中选项修改
oReviseBtn.addEventListener("click", reviseFn);
function reviseFn() {
  var aInput = oTbody.querySelectorAll(".inputBtn2");
  // if(){

  // }
  for (var i = 0; i < aInput.length; i++) {
    if (aInput[i].checked == true) {
      var id = aInput[i].parentNode.nextElementSibling.innerText;
      for (var i = 0; i < data.length; i++) {
        if (data[i].levelName == id) {
          document.querySelector(".editName").value = data[i].levelName;
          document.querySelector(".editDescription").value =
            data[i].LevelContent;
          document.querySelector(".editPhonetic").value = data[i].pinyinCode;
          document.querySelector(".editWuBi").value = data[i].fiveCode;
          document.querySelector(".editRemark").value = data[i].remark;
        }
      }
    }
  }
}
//修改后保存
oSubmitEditBtn.addEventListener("click", submitEditFn);
function submitEditFn() {
  //   var id = document.querySelector(".editName").value;
  var aInput = oTbody.querySelectorAll(".inputBtn2");
  for (var i = 0; i < aInput.length; i++) {
    if (aInput[i].checked == true) {
      var id = aInput[i].parentNode.nextElementSibling.innerText;
      for (var i = 0; i < data.length; i++) {
        if (data[i].levelName == id) {
          data[i].levelName = document.querySelector(".editName").value;
          data[i].LevelContent =
            document.querySelector(".editDescription").value;
          data[i].pinyinCode = document.querySelector(".editPhonetic").value;
          data[i].fiveCode = document.querySelector(".editWuBi").value;
          data[i].remark = document.querySelector(".editRemark").value;
        }
      }
    }
  }
  $("#reviseModal").modal("hide");
  render();
}
